<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta content="width=device-width,initial-scale=1,maximum-scale=1" name="viewport">
    <meta content="telephone=no,email=no,address=no" name="format-detection">
    <meta content="on" http-equiv="x-dns-prefetch-control">
    <meta name="renderer" content="webkit" />
    <meta name="keyword" content="" />
    <meta name="description" content="" />
    <title>虚拟货币</title>
    <link rel="stylesheet" href="../../../static/css/reset.css">
    <link rel="stylesheet" href="../../../static/vendor/toastify/toastify.min.css">
    <link rel="stylesheet" href="../../../static/css/main.css">
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="../../../static/vendor/html5shiv.min.js"></script>
    <script src="../../../static/vendor/respond.min.js"></script>
    <script>
        alert("您的浏览器版本过低请升级！");
        location.href = "http://outdatedbrowser.com/zh-cn";
    </script>
    <![endif]-->
</head>
<body class="model-body">
    <div id="app">
        <div class="model-page">
            <form id="real-name-verification">
                <div class="model-form">
                    <div class="model-form-item">
                        <div class="item-label">
                            真实姓名：<div class="warn">认证成功后不能更改，请务必填写真实姓名，防止影响后期提现操作。</div>
                        </div>
                        <div class="item-control">
                            <input name="name" type="text" class="model-text" />
                        </div>
                    </div>
                    <div class="model-form-item">
                        <div class="item-label">
                            地区/国家：
                        </div>
                        <div class="item-control">
                            <select name="country" class="model-text">
                                <option value="1">中国大陆</option>
                                <option value="1">中国香港</option>
                                <option value="1">中国台湾</option>
                                <option value="1">美国</option>
                                <option value="1">英国</option>
                                <option value="1">德国</option>
                                <option value="1">法国</option>
                                <option value="1">俄罗斯</option>
                            </select>
                        </div>
                    </div>
                    <div class="model-form-item">
                        <div class="item-label">
                            证件类型：
                        </div>
                        <div class="item-control">
                            <select name="paper_type" class="model-text">
                                <option value="1">身份证</option>
                                <option value="1">军人证</option>
                                <option value="1">侨民证</option>
                            </select>
                        </div>
                    </div>
                    <div class="model-form-item">
                        <div class="item-label">
                            证件号码：
                        </div>
                        <div class="item-control">
                            <input name="paper_code" type="text" class="model-text" />
                        </div>
                        <div class="agree-protocol-cont">
                            <label class="agree-protocol" for="agree-protocol-control">
                                我保证提交的信息都是正确的
                                <input type="checkbox" value="" id="agree-protocol-control">
                            </label>
                        </div>
                    </div>
                    <div class="model-form-item">
                        <div class="item-control">
                            <button class="model-btn submit-btn">确认</button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <script src="../../../static/vendor/jquery.min.js"></script>
    <script src="../../../static/vendor/layer/layer.js"></script>
    <script src="../../../static/vendor/jquery.validate/jquery.validate.min.js"></script>
    <script src="../../../static/vendor/jquery.validate/jquery.validate.extend.js"></script>
    <script src="../../../static/vendor/toastify/toastify-js.js"></script>
    <script src="../../../static/vendor/vue.min.js"></script>
    <script src="../../../static/vendor/vue-i18n.min.js"></script>
    <script src="../../../static/js/main.js"></script>
    <script>

        $(function(){

            $(".submit-btn").on("click",function(){
                $("#real-name-verification").validate({
                    rules: {
                        name: {
                            required: true
                        },
                        country: {
                            required: true
                        },
                        paper_type: {
                            required: true
                        },
                        paper_code: {
                            required: true
                        }
                    },
                    messages: {
                        name: "请输入真实姓名",
                        country: "请选择国家/地区",
                        paper_type: "请选择证件类型",
                        paper_code: "请输入证件号码"
                    },
                    submitHandler:function(form){
                        myToast("在这里提交~",'info');
                    }
                })
            })

            //保证
            $(".agree-protocol").on("click",function(){
                var flag = $("#agree-protocol-control").prop("checked");
                if( flag ){
                    $(this).addClass("checked");
                }else{
                    $(this).removeClass("checked");
                }
            })

        })

    </script>
</body>
</html>